import React, { useState } from 'react';
import { Input, Button } from 'antd';
import './main.css';
import connect from '../../context/connect';
import * as logic from './store';
import * as evts from './events';

// interface SearchProps {
//     onSearch: (value: string) => void;
// }
let inputValue = '';

export default connect(['count'], function (props) {

    // function record (e) {
    //     inputValue = e.target.value;
    // }

    // const [loading, setLoading] = useState(false);

    // const [state, setState] = props.ctx;

    const that = {
        loading: useState(false),
        props,
    };

    const [loading] = that.loading;
    const [state] = props.ctx;

    return (
        <div className="search">
            { 
                loading
                ? 'loading...'
                : state.count
            }
            
            <Button onClick={ evts.onClick.bind(that) }>+1</Button>
            {/* <Input className="search-input" onChange={ record } />
            <Button type="primary" onClick={ () => props.onSearch(inputValue) }>搜索</Button> */}
        </div>
    );
});
